import Vue from 'vue'
import Main from './index.vue'
const NoticeConstructor = Vue.extend(Main) // 直接将Vue组件作为Vue.extend的参数。新版vue-loader升级后要求加上`.default`，感谢评论指出~

let nId = 1;

const Notice = (content) => {
  let id = 'notice-' + nId++;

  const instance = new NoticeConstructor({
    data: {
      content: content
    }
  }) // 实例化一个带有content内容的Notice

  instance.id = id;
  instance.vm = instance.$mount(); // 挂载但是并未插入dom，是一个完整的Vue实例
  instance.vm.visible = true;
  instance.dom = instance.vm.$el;
  document.body.appendChild(instance.dom); // 将dom插入body
  instance.dom.style.zIndex = nId + 1001; // 后插入的Notice组件z-index加一，保证能盖在之前的上面
  return instance.vm;
}

export default {
  install: Vue => {
    Vue.prototype.$notice = Notice // 将Notice组件暴露出去，并挂载在Vue的prototype上
  }
}